<template>
  <h2>子组件</h2>
  <ul>
    <li>继承的家产：{{ money }}</li>
    <li>继承的车：{{ car }}</li>
    <button @click="handleClick">子组件触发</button>
    <li>接收的 provide：{{ provideCount }}</li>
  </ul>
  <GenderSon />
</template>
<script setup lang="ts">
import { computed, inject } from 'vue';
import GenderSon from './genderSon.vue';

// 类型接口 定义 defineProps 的类型
interface Props {
  money?: number;
  car?: string;
}

// * 子组件通过 defineProps 定义 Props 且 defineProps 不需要导入

// 定义 Props
defineProps<Props>();

// 定义 Emits
const emit = defineEmits(['xiu']);

const handleClick = () => {
  emit('xiu', 10000);
};

// provide('key', value); // 提供数据
// const value = inject('key'); // 接收数据
const provideCount = inject('provideCount');
</script>
